<template>
	<PageContainer>
		<template #header>
			<view class="search-box flex-row-between">
				<u-search v-model="queryParams.name" @custom="toSearch" @search="toSearch" @clear="toClear"
					placeholder="请输入关键词" :show-action="true" />
			</view>
		</template>
		<view class="home-container">
			<!-- Banner -->
			<u-swiper :list="bannerList" keyName="image" showTitle :autoplay="false" circular></u-swiper>
			<ScrollList :list="dataList" :is-loading="isLoading" :total="total" :query-params="queryParams">
				<view>
					<template v-for="item in dataList">

					</template>
				</view>
			</ScrollList>
		</view>
		
	</PageContainer>
</template>
<script>
	import store from '@/store';
	import PageContainer from '@/components/PageContainer/PageContainer.vue';
	import ScrollList from '@/components/ScrollList/index.vue';
	export default {
		components: {
			PageContainer,
			ScrollList
		},
		data() {
			return {
				bannerList: [{
						image: "https://xxx.com/swiper/swiper2.png",
						title: "昨夜星辰昨夜风，画楼西畔桂堂东",
					},
					{
						image: "https://xxx.com/swiper/swiper1.png",
						title: "身无彩凤双飞翼，心有灵犀一点通",
					},
					{
						image: "https://xxx.com/swiper/swiper3.png",
						title: "谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳",
					},
				],
				appList: [{
					id: 1,
					name: '会议',
					badge: '1',
					img: '/static/images/grid-icon/25.png',
				}, {
					id: 2,
					name: '考勤',
					badge: '',
					img: '/static/images/grid-icon/26.png',
				}, {
					id: 3,
					name: '审批',
					badge: '',
					img: '/static/images/grid-icon/27.png',
				}, {
					id: 4,
					name: '工作报告',
					badge: '',
					img: '/static/images/grid-icon/28.png',
				}, {
					id: 5,
					name: '任务',
					badge: '',
					img: '/static/images/grid-icon/29.png',
				}, {
					id: 6,
					name: '任务',
					badge: '',
					img: '/static/images/grid-icon/29.png',
				}, {
					id: 7,
					name: '任务',
					badge: '',
					img: '/static/images/grid-icon/29.png',
				}, {
					id: 8,
					name: '任务',
					badge: '',
					img: '/static/images/grid-icon/29.png',
				}],
				queryParams: {
					size: 10,
					current: 1,
					name: '',
				},
				isLoading: false,
				total: 0,
				dataList: [],
			}
		},
		methods: {
			toSearch(value) {
				this.queryParams.name = value;
				this.queryParams.current = 1;
				this.getDataList(1);
			},
			toClear() {
				this.queryParams.name = '';
				this.queryParams.current = 1;
				this.getDataList(1);
			},
			async getDataList(type) {
				this.isLoading = true;
				//todo数据请求

				this.isLoading = false;
				uni.stopPullDownRefresh();
			}
		},
		onLoad() {
			this.getDataList();
		},
		onReachBottom() {
			if (this.isLoading) {
				return;
			}
			if (this.queryParams.current * this.queryParams.size < this.total) {
				this.queryParams.current++;
				this.getDataList();
			}
		},
		onPullDownRefresh() {
			this.queryParams.current = 1;
			this.getDataList(1);
		},
	}
</script>

<style scoped lang="scss">
	.home-container {
		padding-top: 30rpx;
	}
	
</style>